#app {
  height: 100%;
}

// 覆写element的全局样式
#app {

  .el- {

    // 按钮
    &button {

      &-- {
        &warning {
          background: #f6b23e;
        }
      }
    }
  }
}

// 公共样式
::v-deep .el-table{
  width: 100%;
  .el-table__header-wrapper table,.el-table__body-wrapper table{
    width: 100% !important;
  }
  .el-table__body, .el-table__footer, .el-table__header{
    table-layout: auto;
  }
}
.sp {

  &- {

    // 主容器布局
    &layout {
      position: relative;
      display: flex;
      flex-direction: column;
      height: 100%;

      &__ {

        // 头部
        &header {
          position: relative;
          z-index: 3;

          &- {

            // 标题栏
            &top {
              display: flex;
              align-items: center;
              justify-content: space-between;
              height: 38px;
              padding: 0 12px;
              font-size: 12px;
              color: #333 #E0E6EE;
              box-sizing: border-box;
            }

            &logo {
              font-weight: bold;
            }

            &link {

              span {
                padding: 0 0 0 12px;
                cursor: pointer;
              }
            }

            // 菜单栏
            &menu {
              display: flex;
              height: 48px;

              & > span {
                display: block;
                height: 100%;
                font-size: 14px;
                line-height: 48px;
                color: #666;
                font-weight: 400;
                padding: 0 16px;
                cursor: pointer;
                transition: all .3s;
                &.active,
                &:hover {
                  color: #fff;
                  background: linear-gradient(180deg, #7595d8 0%, #4068ba 100%);
                }
              }
            }

            // 广告
            &notice {
              position: absolute;
              right: 24px;
              bottom: -64px;
              line-height: 24px;
              font-size: 12px;
              font-weight: bold;
            }
          }
        }

        // 内容
        &mainer {
          width: 100%;
          flex: 1;
          display: flex;
          align-items: flex-start;
        }

        &wrapper {
          background: #fff;
        }

        // 主内容区
        &content {
          flex: 1;
        }
      }
    }

    // 登录
    &login {
      position: absolute 0 0;
      size: 100%;
      background: url('../images/login.jpg') center no-repeat;
      background-size: cover;

      &__ {

        &logo {
          width: 100%;
          height: 100px;
          margin: 0 auto;
          font-size: 24px / 1;
          text-align: center;
        }

        &copy {
          position: absolute;
          bottom: 10px;
          left: 0;
          width: 100%;
          font-size: 12px;
          text-align: center;
          color: #999;
        }

        &form {
          position: absolute;
          top: 0;
          bottom: 0;
          right: 0;
          width: 460px;
          padding: 135px 30px 5px;
          background: #fff;
          box-sizing: border-box;

          .el-button {
            width: 100%;
          }
        }
      }
    }
  }
}